<template>
  <van-dialog
    v-model="visible"
    show-cancel-button
    :beforeClose="handleSubmit"
    confirm-button-color="rgba(25, 137, 250, 1)"
  >
    <div class="ip-container">
      <van-field
        v-model="passwordvalue"
        type="password"
        required
        label="授权密码"
        placeholder="请输入正确的密码"
      />
    </div>
  </van-dialog>
</template>

<script>
import { Dialog } from "vant";
import { toast } from "../utils/common";

export default {
  components: {
    [Dialog.Component.name]: Dialog.Component,
  },
  watch: {
    value(val) {
      this.visible = val;
    },
    visible(val) {
      this.$emit("input", val);
    },
  },
  props: {
    //父给子传递
    value: {
      type: Boolean,
      required: true,
    },
    em_password: {
      type: String,
    },
  },
  data() {
    return {
      savevalue: "",
      visible: this.value,
      statue: "",
      passwordvalue: "",
    };
  },
  methods: {
    handleSubmit(action, done) {
      if (action === "confirm") {
        this.comparePassword();
        if (this.statue == true) {
          toast("密码正确");
          this.passwordvalue = "";
          this.$emit("PasswordSuccess");
          done();
        } else {
          done(false);
        }
      } else {
        done();
      }
    },
    //切换状态
    comparePassword() {
      let newVal = Number(this.passwordvalue);
      if (newVal == this.em_password) {
        this.statue = true;
      } else {
        toast("请输入正确的密码");
        this.statue = false;
        this.passwordvalue = "";
      }
    },
  },
  mounted() {
    //组件进来将父组件给的value值给visible
    this.visible = this.value;
    console.log(this.visible);
  },
};
</script>

<style scoped lang="less">
.ip-container {
  padding: 1rem;
}
</style>
